<!--巡查信息-->
<template>
    <div id="patrolInformation">
        <div class="JBXX">
            <p class="title">巡查信息</p>
            <van-field readonly v-model="fromData.patrolPerson" placeholder="排查人" label="排查人" />
            <van-field readonly v-model="fromData.patrolDate" placeholder="巡查时间" label="巡查时间" />
        </div>
        <div class="JBXX">
            <p class="title">房屋用途</p>
            <van-field readonly required clickable name="picker"
                :value="fromData.isHouseUsageChange | inUseName(Enum.is)" label="房屋用途变化" placeholder="请选择" />
            <van-popup v-model="showPicker.isHouseUsageChange" position="bottom" get-container="#popup">
                <van-picker value-key="name" show-toolbar :columns="Enum.is"
                    @cancel="showPicker.isHouseUsageChange = false" />
            </van-popup>
            <van-field readonly required clickable name="picker"
                :value="fromData.houseUsage | inUseName(Enum.houseUsage)" label="房屋用途" placeholder="请选择" />
            <van-popup v-model="showPicker.houseUsage" position="bottom" get-container="#popup">
                <van-picker value-key="name" show-toolbar :columns="Enum.houseUsage"
                    @cancel="showPicker.houseUsage = false" />
            </van-popup>
        </div>
        <div class="JBXX">
            <p class="title">改扩建情况</p>
            <van-field readonly required clickable name="picker" :value="fromData.isExpansion | inUseName(Enum.is)"
                label="是否改扩建" placeholder="是否改扩建" />
            <van-popup v-model="showPicker.isExpansion" position="bottom" get-container="#popup">
                <van-picker value-key="name" show-toolbar :columns="Enum.is" @cancel="showPicker.isExpansion = false" />
            </van-popup>
            <van-field readonly v-model="fromData.expansionContent" placeholder="改扩建内容" label="改扩建内容" />
        </div>
        <div class="XCZK">
            <p class="title">现场状况</p>
            <div class="radioWrap"><span>受重大工程施工影响</span>
                <van-radio-group v-model="fromData.zdgcyx" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div class="radioWrap"><span>周边山体边坡塌陷</span>
                <van-radio-group v-model="fromData.zbsttx" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div class="radioWrap"><span>房屋倾斜、局部倒塌</span>
                <van-radio-group v-model="fromData.fwqx" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div class="radioWrap"><span>墙体拆除、歪斜</span>
                <van-radio-group v-model="fromData.qtcc" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div class="radioWrap"><span>梁板柱拆除、歪斜</span>
                <van-radio-group v-model="fromData.lbzcc" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div class="radioWrap"><span>钢筋裸露、锈蚀</span>
                <van-radio-group v-model="fromData.gjlu" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div class="radioWrap"><span>防控危房有人居住</span>
                <van-radio-group v-model="fromData.fkwfyrjz" :disabled="disabled">
                    <van-radio :name="1">是</van-radio>
                    <van-radio :name="0">否</van-radio>
                </van-radio-group>
            </div>
            <div>
                <span>其他问题</span>
                <van-field type="textarea" rows="3" v-model="fromData.otherProblem"
                    style="background-color: rgba(230, 230, 230,0.5);margin-top:10px" placeholder="请输入" />
            </div>
            <div v-for="(itemUrl, index) in fileList" :key="index">
                <div style="padding:10px" @click="getGroupGuids(itemUrl,fileList)">
                    <div style="margin:10px 0px 0px 10px;font-size: 14px;margin-bottom: 10px;">
                        {{ itemUrl.name }}
                    </div>
                    <van-uploader :after-read="afterRead" :before-delete="delectFile" v-model="itemUrl.fileList"
                        multiple />
                    <!-- <el-upload action="#" accept=".jpg, .png,.jpeg,jif" :disabled="disabled" :auto-upload="true"
                        list-type="picture-card" :file-list="itemUrl.fileList" :on-remove="delectFile"
                        :on-preview="handlePictureCardPreview" :http-request="afterRead">
                        <i class="el-icon-plus"></i>
                    </el-upload> -->
                </div>
            </div>
        </div>
        <div class="XCZK">
            <p class="title">改扩建情况</p>
            <el-radio-group v-model="fromData.firstJudge">
                <el-radio :label="0">基本安全</el-radio>
                <el-radio :label="1">存在风险</el-radio>
            </el-radio-group>
        </div>
    </div>
</template>

<script>
import axios from "axios";
import { ossUploadFiles, FileServerProxy } from '@/utils/api'
export default {
    name: "patrolInformation",
    props: {
        objectNo: String,
        disabled: Boolean
    },
    data() {
        return {
            BaseURL: window.g.BaseURL,
            Enum: {
                is: [{
                    name: '否',
                    value: 0
                }, {
                    name: '是',
                    value: 1
                }],
                houseUsage: [{
                    name: '经营性自建房',
                    value: 1
                }, {
                    name: '其他自建房',
                    value: 2
                }]
            },
            showPicker: {
                isHouseUsageChange: false,
                houseUsage: false,
                isExpansion: false,
            },
            fromData: {
                "expansionContent": "",
                "fileGroupId": "",
                "firstJudge": "",
                "fkwfyrjz": "",
                "fwqx": "",
                "gjlu": "",
                "houseUsage": "",
                "id": "",
                "isExpansion": "",
                "isHouseUsageChange": "",
                "lbzcc": "",
                "objectNo": "",
                "otherProblem": "",
                "patrolDate": "",
                "patrolPerson": "",
                "qtcc": "",
                "zbsttx": "",
                "zdgcyx": "",
            },
            fileList: [
                {
                    name: '巡查照片',
                    groupGuid: '',
                    fileList: []
                },
            ],
        }
    },
    filters: {
        inUseName: function (msg, data) {
            let name = ''
            data.forEach((item) => {
                if (item.value == msg) {
                    name = item.name
                }
            })
            return name
        },
    },
    methods: {
        getData: async function () {
            if (this.objectNo) {
                let parm = {
                    objectNo: this.objectNo
                }
                let webResult = await axios.post(this.BaseURL + '/api/farmerHouse/housePatrol/getPatrolDetailInfo', parm, {
                    headers: {
                        isOutParam: true,
                    },
                });
                if (webResult.data.data) {
                    for (var i in this.fromData) {
                        for (var k in webResult.data.data) {
                            if (i == k) {
                                this.fromData[i] = webResult.data.data[k]
                            }
                        }
                    }
                    this.fromData.fileGroupId ? this.fileList[0].groupGuid = this.fromData.fileGroupId : "";
                    webResult.data.data.fileGroupList.forEach(item => {
                        this.fileList[0].fileList.push({
                            url: window.g.BaseURL4 + item.fileUrl,
                            isImage: true,
                            name: item.fileName,
                        })
                    })
                }
            }
        },
        //附件
        getGroupGuids(item, list) {
            this.groupName = item.name;
            this.groupGuid = item.groupGuid;
        },
        //上传附件
        afterRead: async function (file) {
            let _this = this;
            var formData = new FormData();
            formData.append("files", file.file);
            formData.append('path', 'wg')
            formData.append("groupName", this.groupName);
            formData.append("toGroupGuid", this.groupGuid);
            const res = await ossUploadFiles(formData)
        },
        //删除附件
        delectFile: async function (file) {
            let fileguid = ''
            if (file.ROW_GUID) {
                fileguid = file.ROW_GUID
            } else {
                fileguid = this.fileGuid
            }
            if (fileguid) {
                let params = {
                    accessCode: 'ce9b691634de4ebca68dc5bb638d07f4',
                    cityCode: window.localStorage.getItem('citycode') ? window.localStorage.getItem('citycode') : '441300000000',
                    params: {
                        fileGuid: fileguid,
                        token: window.localStorage.getItem('token'),
                    },
                }
                const res = await FileServerProxy(params)
                let data = JSON.parse(res.data.data).Success
                if (data) {
                    this.$toast.success('删除成功!')
                }
            }
        },
        //打开附件
        handlePictureCardPreview(file) {
            Eca.Window.OpenWebUrl('预览', file.url, ["85vw", "90vh"]);
        },
        //保存
        saveData: async function (type) {
            let parmData = this.fromData
            parmData['objectNo'] = this.objectNo;
            parmData['fileGroupId'] = this.fileList[0].groupGuid;
            let webResult = await axios.post(this.BaseURL + '/api/farmerHouse/housePatrol/savePatrolInfo', parmData, {
                headers: {
                    isOutParam: true,
                },
            });
            if (type == "submit") {
                this.submit()
            } else {
                if (webResult.data.data) {
                    this.$toast.success("保存成功")
                } else {
                    this.$toast.fail("保存失败")
                }
            }
        },
        //提交
        submit: async function () {
            let parm = {
                objectNo: this.objectNo,
                userName: Eca.CurrentUser.username,
                userId: Eca.CurrentUser.userid
            }
            let webResult = await axios.post(this.BaseURL + '/api/farmerHouse/housePatrol/submitPatrolInfo', parm, {
                headers: {
                    isOutParam: true,
                },
            });
            if (webResult.data.data) {
                this.$toast.success("提交成功")
            } else {
                this.$toast.fail("提交失败")
            }
        },
    },
    mounted() {
        this.fromData.patrolPerson = JSON.parse(
            window.localStorage.getItem("userName")
        ).userName
        this.fromData.patrolDate = this.getDate();
        //给每个附件分组随机生成guid
        this.fileList.forEach(item => {
            item.groupGuid = this.newGuid()
        })
        this.getData()
    }
}
</script>

<style scoped lang="scss">
#patrolInformation {
    width: 100%;

    .title {
        text-align: center;
        font-weight: bold;
        margin-bottom: 10px
    }

    .XCZK {
        padding: 10px;
    }

    .van-radio-group {
        display: inline-block;
    }

    .radioWrap {
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }

    textarea {}

    .van-radio {
        float: left;
        margin-left: 20px;
    }
}
</style>
